<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>K5G-C</title>
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/login.css" />
    <link rel="stylesheet" href="./css/index.css" />
    <style>
        .login-btn{
            display: inline-block;
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            color: #333333;
            background: #C2D3E5;
            display: inline-block;
            height: auto;
            position: relative;
            padding: 5px 10px;
            text-decoration: none;
            border-radius: 4px;
            box-shadow: inset 0 2px 0 rgb(255 255 255 / 20%), inset 0 -2px 0 rgb(0 0 0 / 5%);
            cursor: pointer;
        }
    </style>
</head>

<body style="background-color: rgb(26, 43, 86);">
<div class="item" style="padding: 20px;height: 100px;">
    <img src="./image/one.png" alt="">
</div>

<div class="content" style="margin-top: 50px;">
    <div class="itemOne-item" style="margin-bottom: 40px;">
        <img src="./image/two.png" alt="" style="width: 304px;height: 60px;">
    </div>
    <div class="itemOne-item" style="color: #fff;margin-bottom: 13px;font-size: 13px;">
        パスワードを入力してください
    </div>
    <div class="itemOne-item" onkeydown="keyDown(event);">
        <input class="login-input" name="username" type="hidden" value="admin">
        <input class="login-input" style="margin: auto;width: 300px;height: 35px;" name="password"
               autocomplete="off" id="password" type="password">
    </div>
    <div class="itemOne-item" style="display: flex;justify-content: space-between;margin-top: 13px;">
        <div class="right" style="color: #fff;">
            <input name="psd" id="psd" type="checkbox"  onclick="showData()"/>
            パスワードを表示します
        </div>
        <div class="left">
            <div class="login-btn" onclick="loginSubmit()">ログイン</div>
        </div>
    </div>
</div>
<div class="version" style="color: #fff;">
    V1.0.2
</div>



<div id="selectbox">
    <div class="title">
       <input type="text" class="input-define" id="input-define"  placeholder="请选择"/>
    </div>
    <ul>
       <li>
           <label for="checkbox-01" class="label-check">
              <input type="checkbox" id="checkbox-01" name="checkbox"  value="人流量热力图"/>
           </label>
           人流量热力图
       </li>
       <li>
           <label for="checkbox-02" class="label-check">
               <input type="checkbox" id="checkbox-02" name="checkbox"  value="流量热力图"/>
           </label>
           流量热力图
       </li>
       <li>
           <label for="checkbox-03" class="label-check">
                <input type="checkbox" id="checkbox-03" name="checkbox"  value="景点热度"/>
           </label>
           景点热度
        </li>
        <li>
            <label for="checkbox-04" class="label-check">
                <input type="checkbox" id="checkbox-04" name="checkbox"  value="mr栅格"/>
            </label>
            mr栅格
        </li>
        <li>
             <label for="checkbox-05" class="label-check">
                <input type="checkbox" id="checkbox-05" name="checkbox"  value="热门消费点"/>
             </label>
             热门消费点
        </li>
        <li>
             <label for="checkbox-06" class="label-check">
                 <input type="checkbox" id="checkbox-06" name="checkbox"  value="dpi栅格"/>
             </label>
             dpi栅格
        </li>       
     </ul>
     <span id="data"></span>
  </div>

<script src="./js/utils.js"></script>
<script>
	var time = 234
	
	window.onload = function(){
		getTime()
	}

    function static_num(){
        items = document.getElementsByName('category').checked
        console.log(items,121212121)
    }

    

    function showData(){
        var pwd = document.getElementById('password')
        var mobileDataStatus = document.getElementById("psd").checked == true ? "1" : "0";
        if(mobileDataStatus == 1){
            pwd.type = "text"
        }else{
            pwd.type = "password"
        }
    }
	
	function getTime(){
		var params = {
            data:1
        }
		Ajax.post(baseUrl + '/action/getPasswordBanTime', JSON.stringify(params), function (res) {
            var response = JSON.parse(res)
            if (response.status == 'success') {
				document.getElementById('password').disabled = false
                var theTime = parseInt(response.message);// 秒
                var middle= 0;// 分
                var hour= 0;// 小时

                if(theTime > 60) {
                    middle= parseInt(theTime/60);
                    theTime = parseInt(theTime%60);
                    if(middle> 60) {
                        hour= parseInt(middle/60);
                        middle= parseInt(middle%60);
                    }
                }
                var c = ""+parseInt(theTime)+"秒";
                if(middle > 0) {
                    result = ""+parseInt(middle)+"分"+result;
                }
                if(hour> 0) {
                    result = ""+parseInt(hour)+"小时"+result;
                }
				if(response.message > 0){
					Message.info('パスワードが間違っているため、ログインは'+result+'分に制限されています')
					document.getElementById('password').disabled = true
					setTimeout(function () {
                            document.getElementById('password').disabled = false
                        }, theTime*1000)
				}
			}else{
				Message.info(response.message)
			}
		})
	}

    //执行键盘按键命令
    function keyDown(e){
        var keycode = 0;
        //IE浏览器
        if(CheckBrowserIsIE()){
            keycode = event.keyCode;
        }else{
            //火狐浏览器
            keycode = e.which;
        }
        if (keycode == 13 ) //回车键是13
        {
            loginSubmit()
        }
    }
    //判断访问者的浏览器是否是IE
    function CheckBrowserIsIE(){
        var result = false;
        var browser = navigator.appName;
        if(browser == "Microsoft Internet Explorer"){
            result = true;
        }
        return result;
    }
	
    function loginSubmit() {
        if (!document.getElementById("password").value) {
            Message.info('パスワードを空にすることはできません')
            return false
        }else {
            var params ={
                username:'admin',
                password:document.getElementById('password').value
            }
            Ajax.post(baseUrl + '/action/login', JSON.stringify(params), function (res) {
            var response = JSON.parse(res)
            if (response.status == 'success') {
                if(response.message == '1'){
                    toPage('./psd.html')
                }else {
                    toPage('./dhcp.html')
                }
            } else {
                if(response.message == '0'){
                    Message.info('複数のブラウザを使用して同時にWebUIにログインしないでください')
                }else {
                    var cTimes = response.message
                    if (cTimes < 3) {
                        Message.info('パスワードが間違っています')
                    } else {
                        document.getElementById("password").value = ''
                        document.getElementById('password').disabled = true
                        if (cTimes == 4) {
                            setTimeout(function () {
                                document.getElementById('password').disabled = false
                            }, 180000)
                        }
                        Message.info('連続してパスワードの入力を間違えたため3分間ログインが制限されています')
                    }
                }
            }
        })
        }

    }
</script>
</body>

</html>
